<template>
	<el-row :gutter="5">
		<div class="page-header">
  			评估表详情
  		</div>
		<el-col :lg="12" :md="24">
			<el-collapse v-model="activeNames" @change="">
				<el-collapse-item title="评估表" name="1">
					<!--<wt-model-info v-model="pageDate.patient_info" :model="patient_message" :params-data="paramsData"></wt-model-info>-->
					<div v-loading="loading4">					
					<from-item type = "scan"  :value = "table_info"></from-item>
					<table  class="wt-form">
					<tr>
					<td class="wt-form-label">附件:</td>
					<td>
					<wt-images v-if="img.length!=0" :value="img" size="large" :auto-sign="true">{{img}}</wt-images>
					<template v-else>无</template>
					</td>
					</tr>
					</table>
					</div>
				</el-collapse-item>
			</el-collapse>
			<el-collapse v-model="activeNames" @change="" class="collapse_top">
				<el-collapse-item name="2">
					<template slot="title">
						服务信息<router-link :to="{name:'char',query:{user_id:$route.query.user_id,sc_id:$route.query.service_compose_id}}"><el-button  type="primary" style="float: right;margin-top: 3px;margin-right: 10px" >查看会话</el-button></router-link>
					</template>
					<wt-model-info
					:auto-load="false"
					:value="service_compose_info"
					:model="service_message"
					:params-data="params"
					ref="compose_info"
					v-loading="loading2"></wt-model-info>
				</el-collapse-item>
			</el-collapse>
			<el-collapse v-model="activeNames" @change="" class="collapse_top bottom">
				<el-collapse-item title="评估表状态变更记录" name="3">
					<wt-model-table
					:value="orders_status_time_info"
					:model="service_status"
					:allow-add="false"
					:allow-edit="false"
					:allow-remove="false"
					:auto-load="false"
					:show-pagination="false"
					v-loading="loading3"
					:page-size = "50"></wt-model-table>
					<!--<wt-model-info :value="pageDate" :model="Service"></wt-model-info>-->
				</el-collapse-item>
			</el-collapse>
			<!--<div class="to-operation">-->
				<!--<process v-model="pageDate.service_compose_info" :listId="paramsData.service_compose_id" :orderId="order_id" @update_process="update_process" ></process>-->
			<!--</div>-->
		</el-col>
		<el-col :lg="12"  :md="24">
			<el-collapse v-model="activeNames" @change="">
				<el-collapse-item title="患者信息" name="4">
						<patient-info-message
						:params-data="paramsData"
						:auto-load="false"
						:patient-info="patient_info"
						v-loading="loading1"
					></patient-info-message>
				</el-collapse-item>
			</el-collapse>
		</el-col>
	</el-row>
</template>
<script>
	import Vue from 'vue';
	import ElementUI from 'element-ui';
	import ModelInfo from 'winged/components/wt-model-info';
	import fromItem from '../components/formItem'
	import serviceMessage from '../model/serviceMessage';
	import process from '../components/process';
	import request from 'winged/utils/axios';
	import patientMessage from '../components/patient-info-message';
	import table from 'winged/components/wt-model-table';
	import status from '../model/serviceStatus';
	import Images from 'winged/components/wt-images';
    Vue.component(Images.name, Images);
	Vue.component(ModelInfo.name, ModelInfo);
	Vue.component(process.name, process);
	Vue.use(ElementUI);
	export default {
		components:{
			[[ModelInfo.name]]:ModelInfo,
			[[patientMessage.name]]:patientMessage,
			[[table.name]]:table,
			process,
			fromItem
		},
		data() {
			return {
				activeNames: ['1','2','3','4'],
				// service:Service,
				// patient_message:patientMessage,
				service_message:serviceMessage,
				service_status: status,
				extraParams:null,
				paramsData:{
					user_id:"",
					patient_id:""
				},
				params:{
					user_id:"",
					service_compose_id:"",
				},
				pageDate: {},
				loading1: false,
				loading2: false,
				loading3: false,
				loading4: false,
				patient_info:{},
				table_info:{},
				service_compose_info:{},
				orders_status_time_info:[],
				order_id:"",
				img:[]
			};
		},
		methods:{
			update(data){
				this.pageDate = Object(data,{})
			},
			update_process(){
				this.$refs.compose_info.load()
			},
			handleImagesChange(data){
				this.pageDate.service_compose_info. firm_code_image_path.push(data)
			},
			getSuggest:function(bmi_grade){
				switch(bmi_grade){
					case '粉色':
						return '根据您的BMI和腰围，您属于偏轻体重，请适当增重';
					case '绿色':
						return '根据您的BMI和腰围，您属于标准体重，请继续保持';
					case '黄色':
						return '根据您的BMI和腰围，您属于超重体重，请进行深度评估';
					case '红色':
						return '根据您的BMI和腰围，您属于肥胖体重，请进行深度评估';
					case '金色':
						return '您已完成手术，请遵医嘱，定期复查';
				}
			},
			load() {
				let path = this.service_message.query.url;
				let method = this.service_message.query.method;
				let information = {
					user_id : this.$route.query.user_id,
					service_compose_id : this.$route.query.service_compose_id
				};
				let transfer = this.service_message.query.transfer;
				this.loading1 = true;
				this.loading2 = true;
				this.loading3 = true;
				this.loading4 = true;
				request(path, method, information, transfer, (data)=>{
					if(typeof(data) == 'string'){
						data = JSON.parse(data)
					}						
					if(data.status == 'SUCCESS'){
						this.patient_info = Object.assign({},data.patient_info);
						this.service_compose_info = Object.assign({},data.service_compose_info);
						this.orders_status_time_info = data.orders_status_time_info;
						let arr = data.evaluation_answers;
						console.log('data.auto_evaluations',data.auto_evaluations)
						//对评估结果进行排序
						let auto_evaluations = data.auto_evaluations.sort((a,b) => {
							return a.sort > b.sort
						})
						for(let i = 0;i < auto_evaluations.length; i++){
							if(auto_evaluations[i].param_slug == "loose_weight_bmi"){
								arr.push({
									question_content:"BMI值",
									text_answer:auto_evaluations[i].result,
									unit:' '+auto_evaluations[i].report,
								})
							}else if(auto_evaluations[i].param_slug == "loose_weight_whr"){
								arr.push({
									question_content:"腰臀比",
									text_answer:auto_evaluations[i].result,
									unit:' '+auto_evaluations[i].report,
								})
							}else if(auto_evaluations[i].param_slug == "loose_weight_wher"){
								arr.push({
									question_content:" 腰围身高比",
									text_answer:auto_evaluations[i].result,
									unit:' '+auto_evaluations[i].report,
								})
							}else if(auto_evaluations[i].param_slug == "loose_weight_fat_rate"){
								arr.push({
									question_content:" 身体脂肪率",
									text_answer:auto_evaluations[i].result,
									unit:' '+auto_evaluations[i].report,
								})
							}else if(auto_evaluations[i].param_slug == "loose_weight_bvi"){
								arr.push({
									question_content:" 容积指数",
									text_answer:auto_evaluations[i].result,
									unit:' '+auto_evaluations[i].report,
								})
							}
						}
						
						//健康建议
						let bmi_grade = auto_evaluations.filter(item => {
							return item.param_slug == "loose_weight_bmi_classify"
						})[0].report
						arr.push({
							question_content:" 健康建议",
							text_answer:this.getSuggest(bmi_grade),
							unit:' '
						})

						this.table_info = arr
						// this.table_info = this.table_info.push({
						// 	question_content :
						// })
					}else{
						this.$message.error('查询出错');
					}
					this.loading1 = false;
					this.loading2 = false;
					this.loading3 = false;
					this.loading4 = false;
				}, (error)=> {
					this.loading1 = false;
					this.loading2 = false;
					this.loading3 = false;
					this.loading4 = false;
					this.$message.error('加载出错');
					// 失败情况的回调
				},true)
			},
			loadOrder() {
				let path = 'evaluation/consulting/get_assessment_form_info'
				let information = {
					user_id : this.$route.query.user_id,
					sc_id : this.$route.query.service_compose_id
				};
				this.loading4 = true;
				request(path, 'DRONE', information, true, (data)=>{
					if(typeof(data) == 'string'){
						data = JSON.parse(data)
					}
					if(data.status == 'SUCCESS'){
						this.img = data.assess_order_info.order_files;
					}else{
						this.$message.error('查询图片出错');
					}
					this.loading4 = false;
				}, (error)=> {
					this.loading4 = false;
					this.$message.error('加载图片出错');
					// 失败情况的回调
				},true)
			},
		},
		created(){
			this.loadOrder();
			this.load();		
		}
	}
</script>
<style scoped>
	.collapse_top{
		margin-top: 15px;
	}
	.bottom{
		margin-bottom: 15px
	}
	.to-operation{
		background-color: #fefefe;
		margin-top: 15px;
		padding:0 15px 10px 15px;
		margin-bottom: 15px;
	}
</style>
